<template>
  <div>


	<myheader></myheader>

	<br /><br />
	<!-- 面包屑导航 -->
	<Breadcrumb :datas='datas'></Breadcrumb>


	<section class="featured-block text-center">
		<div class="container">
			
			<div>用户名 : <input type="text" v-model="username"></div><br />
			<div>密  码 : <input type="password" v-model="password1"></div><br />
			<div>确认密码: <input type="password" v-model="password2"></div><br />
			<div>请输入验证码: <input type="text" v-model="code">
            <img :src="src" alt="">
			<button @click="changeimg"></button>
            </div>
			<br />
			<br><br>
			<button @click="submit1">注册</button>
		</div>

	</section>
	<myfooter></myfooter>res

	
	

    
  </div>
  
</template>


 
<script>

// 组件包含
import myheader from './myheader.vue';
import myfooter from './myfooter.vue';



export default {
  data () {
    return {
	  username: '',
	  password1: '',
	  password2: '',
	  // 输入的验证码
	  code: '',
	  // 获取的验证码
	  src: 'http://localhost:8000/mycode/',
	  // 面包屑导航数据
	  datas: [
		  {title: '首页', route:{name: 'index'}},
		  {title: '注册页面', route:{name: 'register'}},
		]
    }
  },
  mounted:function(){

   
  },
  methods:{
	  changeimg(){
		  let num = Math.ceil(Math.random()*10);
		  this.src = this.src + '?code=' + num
	  },



	  // 注册按钮点击事件
	  submit1:function(){
		  // 判断用户名是否为空
		  if(this.useranme == ''){
			  this.$Message('用户名不能为空');
			//   alert('用户名不能为空');
			  return false;
		  }
		  // 判断密码是否为空
		  if(this.password1 == ''){
			  this.$Message('密码不能为空');
			//   alert('密码不能为空');
			  return false;
		  }
		  // 判断两次输入的密码是否相同
		  if(this.password1 != this.password2){
			  this.$Message('密码不一致,请重新输入');
			//   alert('密码不一致,请重新输入');
			  return false;
		  }
		  // 发起请求,将数据传入
		  this.axios.get('http://localhost:8000/register/',{params:{
			  username:this.username,password:this.password1,code:this.code
		  }}).then((result) =>{
			  // 展示返回的的数据
			  alert(result.data['message']);
			  if(result.data['code'] == 405){
				  window.location.href = "http://127.0.0.1:8080/register";
				  return false;
			  }
			  window.location.href = "http://127.0.0.1:8080";
		  })

	  },
	  // 用于获取验证码
     
  },
  // 生命组件
  components:{
	  'myheader':myheader,
	  'myfooter':myfooter,
  }
}


</script>
 
<style>



</style>